<!--
 * @Author: 詹真琦(legendryztachi@gmail.com)
 * @Date: 2022-05-17 11:24:59
 * @LastEditors: 代琪 1529992814@qq.com
 * @LastEditTime: 2022-08-18 18:02:13
 * @FilePath: \code\ctp-static-portal-front\src\views\bulletin\components\bulletinItem.vue
 * @Description: 
-->
<template>
  <div class="item-wrap">
    <div class="info-title">
      <span v-if="data.extText" class="top">[{{ i18n('section.column.flag.top') }}]</span>
      <a :href="`${newsBasePath}${data.link}`" target="_blank">{{ data.subject }}</a>
      <icon :item="data" />
    </div>

    <div class="info-content">
      <div class="info-main">
        <span>{{ data.publishDepartment }}</span>
        <span>{{ data.publishMember }}</span>
        <span>{{ data.createDate }}</span>
        <span>{{ i18n('common.bbs.block.label') }}：{{ data.categoryLabel }}</span>
      </div>
    </div>
  </div>
</template>

<script>
  import Icon from '@/components/common/newsTitleIcons.vue';
  export default {
    name: 'BulletinItem',
    components: {
      Icon
    },
    props: {
      data: {
        type: Object
      }
    },
    data() {
      return {
        imagePath: uploadPath,
        newsBasePath: `${_basePath}/`
      };
    },
    methods: {
      i18n(code) {
        return $.i18n(code);
      }
    }
  };
</script>

<style lang="scss" scoped>
  .item-wrap {
    margin: 0 30px;
    overflow: hidden;
    border-bottom: 1px solid #f3f3f3;

    .info-title {
      height: 40px;
      margin-top: 5px;
      overflow: hidden;
      font-size: 16px;
      line-height: 40px;
      color: #666;
      text-align: left;
      cursor: pointer;

      > div {
        display: inline-block;
      }

      > .top {
        font-size: 16px;
        font-weight: bold;
        color: red;
      }
    }

    .info-content {
      padding-bottom: 10px;
      font-size: 12px;
      color: #999;

      span {
        margin-right: 12px;

        > span {
          margin-right: 0;
        }
      }
    }
  }

  .ib {
    display: inline-block;
  }
</style>
